﻿<div class="container">
    <update-meta property="og:title" content="Penang Realty AUCTION 世界地產拍卖 " />
    <update-meta property="og:url" content="http://www.penangrealty.my/Auction" />
    <!-- <strong>Filter:</strong> {{tableParams.filter()|json}} </p>-->
    <!--modification from yuggohor -->
    <div class="row" ng-hide="true">
        <div class="panel col-lg-12" style="background:none;">
            <div class="panel-heading">
                Advance Search
            </div>
            <div class="panel-body">
                <div class="">
                    <div class="input-group">
                        <div class="input-group-btn">
                            <button type="button" class="btn waves-effect waves-light subscribe-submit" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">{{property.transact == "S"? "Sale" : "Rent"}} <span class="caret"></span></button>
                            <ul class="dropdown-menu dropdown-menu-left">
                                <li><a href="#" ng-click="property.transact = 'S'">Sale</a></li>
                                <li><a href="#" ng-click="property.transact = 'R'">Rent</a></li>
                            </ul>
                        </div><!-- /btn-group -->
                        <input class="form-control" aria-label="..." style="height:43px;border-width:3px;">
                        <div class="input-group-btn">
                            <button type="button" class="btn waves-effect waves-light subscribe-submit" data-toggle="collapse" data-target="#AdvanceSearch">More <span class="caret"></span></button>
                        </div>
                    </div><!-- /input-group -->
                    <div id="AdvanceSearch" class="collapse">
                        <div class="btn-group" role="group" aria-label="...">
                            <button type="button" class="btn btn-default" ng-class="{'active' : property.Type == 'R'}" ng-click="property.Type = 'R'">Residential</button>
                            <button type="button" class="btn btn-default" ng-class="{'active' : property.Type == 'C'}" ng-click="property.Type = 'C'">Commercial</button>
                            <button type="button" class="btn btn-default" ng-class="{'active' : property.Type == 'I'}" ng-click="property.Type = 'I'">Industrial</button>
                            <button type="button" class="btn btn-default" ng-class="{'active' : property.Type == 'L'}" ng-click="property.Type = 'L'">Land</button>
                        </div>
                    </div>
                </div><!-- /.col-lg-6 -->
            </div>
        </div>
    </div><!-- /.row -->
    <!--<div class="row" style="background:url('/images/computer-opacity.png');background-size:100%">
        <div class="form-group">
            <label class="col-sm-2 control-label" pop-over-html pop-over-content='view' style="color:#ff4538;">Sale Type</label>
            <div class="col-sm-10">
                <div class="btn-group" role="group" aria-label="..." ng-init="property.transact = 'S'">
                    <button type="button" class="btn btn-default" ng-class="{'active' : property.transact == 'S'}" ng-click="property.transact = 'S'">Sale</button>
                    <button type="button" class="btn btn-default" ng-class="{'active' : property.transact == 'R'}" ng-click="property.transact = 'R'">Rent</button>
                </div>
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-2 control-label" style="color:#ff4538;">Property Type</label>
            <div class="col-sm-10">
                <div class="btn-group" role="group" aria-label="..." ng-init="property.Type = 'R'">
                    <button type="button" class="btn btn-default" ng-class="{'active' : property.Type == 'R'}" ng-click="property.Type = 'R'">Residential</button>
                    <button type="button" class="btn btn-default" ng-class="{'active' : property.Type == 'C'}" ng-click="property.Type = 'C'">Commercial</button>
                    <button type="button" class="btn btn-default" ng-class="{'active' : property.Type == 'I'}" ng-click="property.Type = 'I'">Industrial</button>
                    <button type="button" class="btn btn-default" ng-class="{'active' : property.Type == 'L'}" ng-click="property.Type = 'L'">Land</button>
                </div>
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-2 control-label" pop-over-html pop-over-content='view'>Sale Type</label>
            <div class="col-sm-10">
                <select ng-model="property.transact" class="form-control" ng-selected="property.transact" ng-init="property.transact = 'S'">
                    <option style="display:none" value="">Select</option>
                    <option value="S">SALE</option>
                    <option value="R">RENT</option>
                </select>
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-2 control-label">Property Type</label>
            <div class="col-sm-10">
                <select ng-model="property.Type" class="form-control" ng-selected="property.Type" ng-init="property.Type = 'R'">
                    <option style="display:none" value="">Select</option>
                    <option value="R">Residential</option>
                    <option value="C">Commercial</option>
                    <option value="I">Industrial</option>
                    <option value="L">Land</option>
                </select>
            </div>
        </div>
        <div class="form-group">
            <label class="col-lg-2 control-label" style="color:#ff4538;">State</label>
            <div class="col-lg-10 contact_form">
                <div class="input-field" style="margin-bottom:0;">
                    <input id="location" ng-model="property.StateName" type="text" name="location"
                           ng-change="property.StateChanged = true"
                           ng-blur="property.StateChanged = false"
                           ng-focus="property.StateChanged = true" />
                    ng-keypress="($event.keyCode == 13 )? ((property.StateId = (states | filter:{State:property.StateName})[0].StateId) && (property.StateName = (states | filter:{State:property.StateName})[0].State) && (property.StateChanged = false) && changeState()) : null"
                </div>
                <div class="autocomplete" ng-show="property.StateChanged">
                    <ul>
                        <li ng-repeat="state in states | filter:{State:property.StateName }"
                            ng-mousedown="property.StateId = state.StateId;property.StateName = state.State;property.StateChanged = false;property.location = '';changeState()">{{state.State}}</li>
                    </ul>
                </div>
            </div>
        </div>
        <div class="form-group">
            <label class="col-lg-2 control-label" style="color:#ff4538;">Location</label>
            <div class="col-lg-10 contact_form">
                <div class="input-field" style="margin-bottom:0;">
                    <input id="location" ng-model="property.location" type="text" name="location"
                           ng-change="property.LocationChanged = true"
                           ng-blur="property.LocationChanged = false"
                           ng-focus="property.LocationChanged = true" />
                    ng-keypress="($event.keyCode == 13 )? ((property.location = (locations | filter:property.locationName)[0].Location) && (property.LocationChanged = false) && changeLocation()) : null"
                </div>
                <div class="autocomplete" ng-show="property.LocationChanged">
                    <ul>
                        <li ng-repeat="location in locations | filter:property.locationName"
                            ng-mousedown="property.location = location.Location;property.LocationChanged = false;changeLocation()">{{location.Location}}</li>
                    </ul>
                </div>
            </div>

        </div>
        <div class="form-group">
            <label class="col-sm-2 control-label">State</label>
            <div class="col-sm-10">
                <select ng-model="property.StateId" class="form-control" ng-change="changeState()" ng-selected="property.StateId"
                        ng-options="state.StateId as state.State for state in states">
                    <option style="display:none" value="">Select</option>
                    <option ng-repeat="state in states" ng-value="state.StateId">{{state.State}}</option>
                </select>
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-2 control-label">Location</label>
            <div class="col-sm-10">
                <select ng-model="property.location" class="form-control" ng-change="changeLocation()">
                    <option style="display:none" value="">Select</option>
                    <option ng-repeat="location in locations" ng-value="location.Location" ng-selected="property.LocationId">{{location.Location}}</option>
                </select>
            </div>
        </div>
        <div class="form-group">
            <label class="col-lg-2 control-label" style="color:#ff4538;">Road/Project Name</label>
            <div class="col-lg-10 contact_form">
                <div class="input-field" style="margin-bottom:0;">
                    <input id="location" ng-model="property.project" type="text" name="location">
                </div>
            </div>

        </div>


        <div class="form-group">
            <label for="location" class="col-sm-2 control-label">Road/Project Name</label>
            <div class="col-sm-10">
                <input type="text" class="form-control" ng-model="property.project" placeholder="Road/Project Name eg: Delima" />
            </div>
        </div>



        <div class="form-group">
            <label for="location" class="col-sm-2 control-label" style="color:#ff4538;">Price(RM)</label>
            <div class="col-sm-4">
                <input type="number" class="form-control" string-to-number ng-model="property.priceMin" placeholder="0" />
            </div>
            <label class="col-sm-2 control-label">To</label>
            <div class="col-sm-4">
                <input type="number" class="form-control" string-to-number ng-model="property.priceMax" placeholder="999,999,999" />
            </div>
        </div>

        <div class="col-sm-10 col-sm-offset-2">
            <button type="submit" ng-click="clearEntry()" class="btn waves-effect waves-light subscribe-submit">Clear</button>
            <button type="submit" ng-click="search()" class="btn waves-effect waves-light subscribe-submit pull-right">Search</button>
        </div>
    </div>-->
    <table ng-table="tableParams" class="table table-striped ng-table-responsive" show-filter="true">
        <tr ng-repeat="auction in $data">
            <td colspan="1" ><a ng-href="/AuctionDetail/{{auction.LelongId}}"> <img id="imgpicture" fall-back="images/penang realty,Apartment,house,condominium,terrace house,semi d,detached,bungalow,high end luxury properties,landed properties,gated guarded house.png" ng-src="{{auction.PropertyURL ? auction.PropertyURL :''}}" height="200" width="240" alt="[AUCTION] {{auction.Address}}" title="[AUCTION] {{auction.Address}}"/></a>  </td>
            <td data-title="'Address'" sortable="'Address'" colspan="1"  filter="{ 'Address': 'text' }"> <a ng-href="/AuctionDetail/{{auction.LelongId}}">{{auction.Address}}</a></td>
            <td data-title="'Type'" sortable="'Type'" colspan="1"  align="center" filter="{ 'Type': 'text' }"><br />{{auction.Type}}</td>
            <td data-title="'Price'" sortable="'Price'" colspan="1"  align="center" filter="{ 'Price': 'text' }"><br />{{auction.Price | number}}</td>
            <td data-title="'Auction Date'" sortable="'AuctionDate'" colspan="1"  align="center" filter="{ 'AuctionDate': 'text' }"><br />{{auction.AuctionDate | date:'dd/MM/yyyy'}}</td>

        </tr>

        <tr>
            <td><strong>Count per page:</strong> {{tableParams.count()}}</td>
            <td colspan="4" align="right">
                <p><strong>Page:</strong> {{tableParams.page()}} </p>
            </td>
        </tr>

    </table>

</div>
<!--<style>
    .input-field {
        height: 0px;
    }

    input[type=text] {
        height: 3rem;
    }
</style>-->
